<template>
	<view>
		<checkbox-group @change="checkChange">
			<label class="label" v-for="(item, index) in options" :key="index">
				<checkbox :color="vuex_config.themeColor1" class="check_box" :value="item.name" />
				{{ item.name }}
			</label>
		</checkbox-group>
	</view>
</template>

<script>
export default {
	props: {
		value: {
			type: String,
			default: ''
		},
		options: {
			type: Array,
			default: []
		}
	},
	data() {
		return {};
	},
	components: {},
	data() {
		return {
			checked: []
		};
	},

	mounted() {},

	methods: {
		checkChange(e) {
			this.checked = e.detail.value;
			this.$emit('input', this.checked.join(','));
		}
	}
};
</script>

<style scoped lang="scss">
.label {
	display: flex;
	align-items: center;
	border: 1px solid rgb(221, 229, 237);
	border-radius: 8rpx;
	padding: 0 20rpx;
	height: 68rpx;
	align-items: center;
	margin-bottom: 30rpx;
	.check_box {
		transform: scale(0.6);
	}
}
</style>
